<template>
	<view class="column-css">
		<view style="margin-top: 24rpx;">
			<view class="title">
				<image v-if="info.transactionType == 1" src="@/static/icon_bill_square.png" mode=""></image>
				<image v-if="info.transactionType == 2" src="@/static/icon_bill_circle.png" mode=""></image>
				<image v-if="info.transactionType == 3" src="@/static/icon_bill_card.png" mode=""></image>
				<text v-if="info.transactionType == 1">运费代收(元)</text>
				<text v-if="info.transactionType == 2">运费收入(元)</text>
				<text v-if="info.transactionType == 3">余额提现(元)</text>
			</view>
			<view class="money">{{ info.transactionType == 1 ? '+' : '-' }}{{ info.money }}</view>
		</view>
		<view class="row-css" style="margin-top: 24rpx;">
			<view class="left" v-if="info.transactionType != 3">付款方名称</view>
			<view class="left" v-else>收款方名称</view>
			<view class="right" v-if="info.transactionType != 3">
				{{ info.draweeName }}
			</view>
			<view class="right" v-else="datatrans.payeeBankNo !=''">
				<!-- {{ info.payeeName }}({{ info.payeeTel }}) -->
				{{ info.bankName }}({{ info.payeeBankNo.slice(-4) }})
			</view>
			<!-- <view class="right" v-if="info.recordType == 1">{{ info.draweeName }}</view>
			<view class="right" v-if="info.recordType == 2">{{ info.bankName }}({{ info.payeeBankNo.slice(-4) }})</view> -->
		</view>
		<view class="row-css">
			<!-- <view class="left">{{info.recordType == 1 ? '支付时间' : '提现时间'}}</view> -->
			<view class="left" v-if="info.transactionType != 3 ">支付时间</view>
			<view class="left" v-else>提现时间</view>
			<view class="right">{{ info.creationTime }}</view>
		</view>
		<view class="row-css" v-if="info.transactionType != 3">
			<view class="left">配载单号</view>
			<view class="right">{{ info.loadingOrderBillNo }}</view>
		</view>
		<view class="row-css"  v-if="info.custNo !=''">
			<view class="left">客户单号</view>
			<view class="right">{{ info.custNo }}</view>
		</view>
		<view class="row-css">
			<view class="left">交易流水号</view>
			<view class="right">{{ info.serialNumber }}</view>
		</view>
		<view class="row-css" v-if="info.transactionType != 3 ">
			<view class="left">备注</view>
			<view class="right">{{info.remark}}</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			tradeId:"",
			info: {},
		};
	},
	onLoad: function(options) {
		// this.info = JSON.parse(options.info)
       this.tradeId = options.info
	   this.wxRequest({
	   	url:`${this.API}/DriverDetails/getDriverDetailsId?driverDetailsId=${this.tradeId}`,
	   	method: 'GET',
	   	// data: {
	   	// 	tradeId: this.tradeId
	   	// },
	   	title: '查询中...',
	   	success: res => {
	   		this.info = res.data.data;
	   	}
	   });
	},
	methods: {
		
	}
};
</script>

<style lang="scss">
	.column-css{
		padding: 0 24rpx;
		box-sizing: border-box;
	}
	.title{
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		font-weight: 400;
		color: #9E9E9E;
		image{
			width: 32rpx;
			height: 32rpx;
			margin-right: 12rpx;
		}
	}
	.money{
		font-size: 80rpx;
		font-weight: 500;
		color: #000000;
		margin-top: 12rpx;
		text-align: center;
	}
page {
	background: #ffffff;
	font-size: 30rpx;
}

.row-css {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	border-bottom: 1rpx solid #F9F9F9;
	box-sizing: border-box;
	padding: 32rpx 0;
	.left{
		width: 25%;
		color: #333330;
	}
	.right{
		width: 74%;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		font-size: 28rpx;
		font-weight: 500;
		color: #A4A4A4;
	}
}
</style>
